﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/PictureMaster.Master" Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	<%
		PictureGroup group = ViewData["PictureGroup"] as PictureGroup;
	%>
	<%=group.Name %> - <%=group.PictureCategory.Name%> - 热图首页 - 热点网
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
	<%
		PictureGroup group = ViewData["PictureGroup"] as PictureGroup;
		PictureGroup[] groups = ViewData["RelationalGroups"] as PictureGroup[];
		Picture currentPicture = ViewData["PictureCurrent"] as Picture;
		News[] referenceNews = ViewData["RefNews"] as News[];
		List<string> pictureTagNames = ViewData["PictureTags"] as List<string>;
		int prePicId = int.Parse(ViewData["PrePictureID"].ToString());
		int nextPicId = int.Parse(ViewData["NextPictureID"].ToString());

		int groupLength=int.Parse(ViewData["PictureGroupLength"].ToString());
		int position=int.Parse(ViewData["PicturePosition"].ToString());
		
	%>
	<div class="navigateBar">
		<div class="navigateTitle">
			<span><a href="http://www.woxx8.com">窝吧</a></span> >>
			<span><a href="/picture">图片</a></span> >>
			<span><a href="/Picture/Category/<%=group.CategoryID %>"><%=group.PictureCategory.Name%></a></span> >>
			<span class="currentPosition"><%=group.Name %></span>
		</div>
	</div>
	
	<div style="border:1px solid #c3c3c3; width:962px;">
		<div id="left" class="fl">
			<div class="tac" style="width:720px; border-top:1px solid white;border-right:1px solid #c3c3c3;border-bottom:none;">
				<div class="pictureTag">
					<a href="/PictureTagSearch/?tagName=<%=HttpUtility.UrlEncode(string.Join(" ", pictureTagNames.ToArray()))%>" target="_blank" style=" text-decoration:none; font-size:14px; margin-left:15px; ">标签:</a>
					<%foreach (string item in pictureTagNames)
					{%>
						<a href="/PictureTagSearch/?tagName=<%=HttpUtility.UrlEncode(item) %>" target="_blank"><%=item %></a>
					<%} %>
				
				</div>
				<div class="pictureInfo">
					本组图片共有<span><%=groupLength %></span>张
					<div>当前第[<span><%=position %></span>]张</div>
				</div>
				<div class="groupPictureName">
					<%=group.Name%>
				</div>
				<div style=" margin-bottom:20px; text-align:center;color:Black;">
					<%=group.AddTime.ToString("yyyy年MM月dd日") %>  来源：<%=group.SourceFrom.Name %>
				</div>
				
				<div class="leftArrow" >
					<a href='<%=prePicId>0?string.Format("/picture/group/{0}/?cid={1}",group.GroupID,prePicId):string.Format("/picture/group/{0}",group.GroupID) %>' style='<%=prePicId>0?"color:#6B90DA;":"color:gray;"%>'>‹</a> 
					
				</div>
				<div style=" float:left;width:620px;">
					<div>
						<img id="imgDom" alt="<%=group.Name %>" src='<%=Hotnet.Biz.Properties.Settings.Default.UploadFolder + ( ViewData["PictureCurrent"] as Picture).LocalPath%>' style="cursor:url(/images/next.cur), auto;max-width:630px;"/>
					</div>
				</div>
				<div class="rightArrow" >
					<a style='<%=nextPicId>0?"color:#6B90DA;":"color:gray;"%>' href='<%=nextPicId>0?string.Format("/picture/group/{0}/?cid={1}",group.GroupID,nextPicId):string.Format("/picture/group/{0}",group.GroupID) %>'>›</a>
				</div>

				<div id="descDom" class="p5" style="font-size:15px; clear:left;">
				</div>
			</div>
			
			<div class="refContent">
				<div class="refVideos">
					<%Html.RenderPartial("ReferenceVideo", ViewData["RefVideoControl"]); %>
				</div>
				<div class="referenceNews">
					<div class="moduleTitle">
						<span>您可能感兴趣的文章</span>
					</div>
					<ul>
						<%
							
							for (int i = 0; i < referenceNews.Length; i++)
							{
						%>
							<li>
								<span class="headMark">·</span>
								<a href="/News/View/<%=referenceNews[i].NewsID %>" target="_blank">
									<%=StringUtility.CutString(referenceNews[i].Title,21) %>
								</a>

							</li>
						<% } %>
					</ul>
				</div>
			</div>
		</div>
		<div id="divRefPictureGroup" class="refPictureGroup">
			<div class="moduleTitle">
					<span>相关图片</span>
			</div>
			<ul>
				<%foreach (var pg in groups){%>
					<li>
						<a href="/Picture/Group/<%=pg.GroupID %>/" title="<%=pg.Name %>" class="pictureImgFrame">
							<img src="<%=pg.CoverImage.ThumbnailPath %>" alt="" />
						</a>
						<div class="refPictureName">
							<a href="/Picture/Group/<%=pg.GroupID %>"><%=StringUtility.CutString(pg.Name, 12)%></a>
						</div>
					</li>
				<% } %>
			</ul>
		</div>
		<div class="cb"></div>
	</div>
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="ScriptContent" runat="server">
	<script type="text/javascript">
		var images = [];
		var index = 0;
		images[0] = {};
		//images[0].src = '<%=Hotnet.Biz.Properties.Settings.Default.UploadFolder + ( ViewData["PictureCurrent"] as Picture).LocalPath%>';
		images[0].desc = '<%=Html.Encode(( ViewData["PictureCurrent"] as Picture).Description)%>';
		images[0].image = null;
		
		var preId=parseInt('<%=ViewData["PrePictureID"]%>');
		var nextId=parseInt('<%=ViewData["NextPictureID"]%>');
		var groupId='<%=(ViewData["PictureGroup"] as PictureGroup).GroupID %>';
		var currentPicId='<%=(ViewData["PictureCurrent"] as Picture).PictureID %>';
		var urlHead="/Picture/Group/"+groupId;
		function next(){
			if (nextId == -1)
				return;
			window.location.href = urlHead + "?cid=" + nextId;

		}
		
		function prev(){
			if(preId==-1)
				return;
			window.location.href = urlHead + "?cid=" + preId;
		}

		function showImg(_imgTmp) {
			var image = null;
			if(_imgTmp.image!=null){
				image = _imgTmp.image;
				loadImg();
			}else{
				_imgTmp.image = new Image();
				_imgTmp.image.src = _imgTmp.src;
				_imgTmp.image.onload = loadImg;
				image = _imgTmp.image;
			}
			
			if(index < (images.length-1)){
				images[index+1].image = new Image();
				images[index+1].image.src = images[index+1].src;
			}
			
			function loadImg(){
				var img = document.getElementById("imgDom");
				var imageWidth = image.width;
				var imageHeight = image.height;
				var pagesize = getPageSize();
				var x = pagesize[2] - 150;
				var y = pagesize[3] - 150;
				if (imageWidth > x) {
					imageHeight = Math.round(imageHeight * (x / imageWidth));
					imageWidth = x; 
					if (imageHeight > y) { 
						imageWidth = Math.round(imageWidth * (y / imageHeight));
						imageHeight = y; 
					}
				} else if (imageHeight > y) { 
					imageWidth = Math.round(imageWidth * (y / imageHeight));
					imageHeight = y; 
					if (imageWidth > x) {
						imageHeight = Math.round(imageHeight * (x / imageWidth));
						imageWidth = x;
					}
				}
				
				img.width = imageWidth;
				img.height =imageHeight;
				//img.src = image.src;
			}
		}

		function processPhotoNavigate() {
		var img = document.getElementById("imgDom");
		if (img!=null) {
			var isNext = true;

			img.onmousemove = function(e) {
				var e = window.event || e;
				var eX = e.offsetX;

				if (eX == undefined) {
					eX = e.clientX - img.offsetLeft;
					var offsetParentObject = img.offsetParent;
					while (offsetParentObject != null) {
						eX = eX - offsetParentObject.offsetLeft;
						offsetParentObject = offsetParentObject.offsetParent;
					}
				}

				if (eX < (img.offsetWidth / 2)) {
					isNext = false;
					if (preId != -1)
						img.style.cursor = "url(/images/prev.cur),auto";
					else
						img.style.cursor = "auto";
				} else {
					isNext = true;
					if (nextId != -1)
						img.style.cursor = "url(/images/next.cur),auto";
					else
						img.style.cursor = "auto";
				}
			}
			img.onclick = function() {
				if(isNext){
					next();
				}else if(!isNext){
					prev();
				}
			}
		}
	}

	$(function() {
			var imgTmp = images[0];
			showImg(imgTmp);
			$("#descDom").text(imgTmp.desc);
			processPhotoNavigate();
		});

		$(document).ready(function() {

		});
		
	</script>
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="StyleContent" runat="server">
	<style type="text/css">
		.navigateBar
		{
			width:963px;
		}
		.headMark
		{
			font-size:18px;
			font-weight:bolder;
			color:Black;
		}
		
		.refContent
		{
			float:left;
			width:720px;
			/*border:1px solid #c3c3c3;*/
			border-top:none;
			padding-bottom:5px;
			font-size:14px;
		}
		
		.groupPictureName
		{
			margin-top:50px;
			text-align:center;
			color:black;
			font-size:20px;
			font-family:黑体
		}
		
		/*相关图片组*/
		.refPictureGroup
		{
			width:240px;
			padding-top:10px;
			float:right;
			/*border:1px solid #c6c6c6;*/
			border-left:none;
			background-color:#E4F5F6;
		}
		
		.refPictureGroup ul
		{
			margin:0px;
			padding:0px;
		}
		
		.refPictureGroup li
		{
			list-style-type:none;
			float:left;
			height:175px;
			margin-left:23px;
			_margin-left:13px;
		}
		
		.refPictureGroup img
		{
			 border:none;
			 padding:6px 0px 4px 7px;
			 height:120px;
			 width:160px;
			
		}
		.pictureImgFrame
		{
			float:left;
			width:180px;
			height:136px;
			background:transparent url(/images/picbg_1.gif) no-repeat scroll;
		}
		
		
		.refPictureName
		{
			font-size:14px;
			clear:left;
			text-align:center;
			width:185px;
			line-height:120%;
		}
		.refPictureName a
		{
			text-decoration:none;
			color:#124C9A;
		}
		.refPictureName a:hover
		{
			color:Red;
			text-decoration:underline;
		}
		
		
		
		/* 相关video 样式 */
		.refVideos
		{
			
		}
		.refVideos .refTagVideo
		{
			border:none;
		}
		.refVideos .refTagVideo a
		{
			line-height:120%;
			margin-top:5px;
		}
		.refVideos ul
		{
			margin:0px;
			padding:0px;
		}
		
		.refVideos li
		{
			width:138px;
		}
		
			/* Module 标题 */
		.moduleTitle
		{
			color:#BC2D09;
			font-weight:bold;
			font-size:14px;
			background:transparent url(/images/headerblue.gif) repeat-x scroll 0 8px;
			margin:0 2px 0 2px;
			padding:3px 2px 3px 0px;
		}
		.moduleTitle span{
			background:white none repeat scroll 0 0;
			padding-right:8px;
		}
		
		/*相关新闻*/
		.referenceNews
		{
			float:left;
			
		}
		.referenceNews a
		{
			color:#124C9A;
			text-decoration:none;
		}
		.referenceNews a:hover
		{
			color:red;
			text-decoration:underline;
		}
		.referenceNews ul
		{
			float:left;
			margin:0px;
			padding:0px;
			margin-left:16px;
			*margin-left:20px
			_margin-left:0px;
		}
		.referenceNews li
		{
			list-style-type:none;
			margin:2px 0px;
			float:left;
			width:350px;
			_width:340px;
		}
		
		.browseMore
		{
			font-size: 14px;
			margin-left:510px;
			padding:0px 0px 0px 5px;
			background-color:White;
			text-decoration:none;
		}
		
		/*图片信息样式*/
		.pictureInfo
		{
			float:right;
			border:1px solid #c3c3c3;
			padding:3px;
			border-top:none;
			border-right:none;
			line-height:140%;
		}
		.pictureInfo span
		{
			color:Red;
			font-weight:bold;
			margin:0px 2px;
		}
		
		/*图片标签样式*/
		.pictureTag
		{
			float:left;
			padding:3px 5px;
			border:solid 1px #c3c3c3;
			border-top:none;
			border-left:none;
			background: transparent url(/images/pin.png) no-repeat scroll 3px 1px;
		}
		.pictureTag a
		{
			color:#FF0099;
		}
		.pictureTag a:hover
		{
			font-size:14px;
			font-weight:bold;
		}
		
		.leftArrow
		{
			
		}
		.leftArrow a
		{
			float:left;
			margin-top:150px;
			font-size:60pt;
			top:8px;
			text-decoration:none;
			width:45px;
			_height:60px;
			_padding-top:10px;
		}
		.rightArrow
		{
			
		}
		.rightArrow a
		{
			float:right;
			margin-top:150px;
			font-size:60pt;
			top:8px;
			text-decoration:none;
			width:45px;
			_height:60px;
			_padding-top:10px;
		}
		.rightArrow a:hover
		{
			font-size:72pt;
		}
		.leftArrow a:hover
		{
			font-size:72pt;
		}
	
	</style>
	

</asp:Content>

